$(function() {
	layui.use(["laypage", "table"], function() {
		var laypage = layui.laypage;
		var page, limit;
		var $ = layui.jquery;

		var table = layui.table;

		table.render({
			elem: '#tb',
			 url: '/focus/saveFocus',
			toolbar: '#toolbarDemo', //开启头部工具栏，并为其绑定左侧模板
			height: 480,	
			defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
				title: '提示',
				layEvent: 'LAYTABLE_TIPS',
				icon: 'layui-icon-tips'
			}],
			title: '通讯录数据表',
			cols: [
				[ //表头
					 {
						field: 'id',
						title: 'ID',
						width: 100,
						sort: true,
						fixed: true
					}, {
						field: 'my_attention',
						title: '关注',
						width: 200
					}, {
						field: 'my_name',
						title: '姓名',
						width: 200,
						sort: true
					}, {
						field: 'my_phone',
						title: '手机',
						width: 200
					}, {
						field: 'my_department',
						title: '部门',
						width: 200
					}, {
						field: 'my_job',
						title: '岗位',
						width: 200,
						
					}
				]
			],
			data: [{
				"id":1
			  	,"my_attention": '<i class="layui-icon" flag=1 style="font-size:20px;">&#xe67b;</i>'
			  ,"my_name": "李四"
			  ,"my_phone": "123434"
			  ,"my_department":"人事部"
			  ,"my_job":"经理"
			},{
				"id":2
			  	,"my_attention": '<i class="layui-icon" flag=1 style="font-size:20px;">&#xe67b;</i>'
			  ,"my_name": "王五"
			  ,"my_phone": "23244"
			  ,"my_department":"彻底的"
			  ,"my_job":"但是"
			}],
			page: true

		});

		
		//监听表格复选框选择
		$('table').on('click','i' ,function(obj) {
			var flag1=$(this).attr("flag");
			if(flag1==1){
					$(this).css("color","red");
					$(this).attr("flag",0);
			}else{
				$(this).css("color","black");
				$(this).attr("flag",1);
			}
		
			console.log($(this).attr("flag"))
		});
	/* 	//监听表格复选框选择
		table.on('checkbox(demo)', function(obj) {
			console.log(obj)
		}); */
		//监听工具条
		table.on('tool(demo)', function(obj) {
			var data = obj.data;
			
			if (obj.event === 'detail') {
				layer.msg('ID：' + data.id + ' 的查看操作');
			} else if (obj.event === 'del') {
				layer.confirm('真的删除行么', function(index) {
					obj.del();
					layer.close(index);
				});
			} else if (obj.event === 'edit') {
				layer.alert('编辑行：<br>' + JSON.stringify(data))
			}
		});
		$('.layui-btn').on('click', function() {
			var type = $(this).data('type');
			active[type] ? active[type].call(this) : '';
		});
	})
})
